<%layout("/common/_layout.html"){ %>
<%#ajax userTable:{%>
<div class="am-cf am-padding">
  <div class="am-fl am-cf"> <strong class="am-text-primary am-text-lg">运营管理</strong>
    /
    <small>启动页广告管理</small>
  </div>
</div>
<form class="am-form" id="list-form" action="${base}/splashImage/list" method="post">
  <input type="hidden" id="keywords" name="keywords" value='${keywords!""}' />
  <div class="am-g">
    <div class="am-u-sm-12 am-u-md-6" style="padding:0px 1.6rem 1.6rem 1rem;margin:0px;">
      <div class="am-btn-toolbar">
        <div class="am-btn-group am-btn-group-xs">
          <%if(so.hasPermission("SPLASH_IMAGE_ADD")) {%>
          <button type="button" class="am-btn am-btn-default" onclick="location.href='${base}/splashImage/add'">
            <span class="am-icon-plus"></span>
            新增
          </button>
          <%}%>
          <%if(so.hasPermission("SPLASH_IMAGE_DELETE")) {%>
          <button type="button" id="deleteButton" disabled="disabled" class="am-btn am-btn-default"  onclick="deleteAll('${base}/splashImage/delete')">
            <span class="am-icon-trash-o"></span>
            删除
          </button>
          <%}%></div>
      </div>
    </div>
    <div class="am-u-sm-12 am-u-md-3">
      <div class="am-input-group am-input-group-sm">
        <input type="text" class="am-form-field" id="title" value="${title!}" placeholder="按名称搜索">
        <span class="am-input-group-btn">
          <button  id="submit-btn" class="am-btn am-btn-default" type="button">搜索</button>
        </span>
      </div>
    </div>
  </div>
</form>
<div class="am-g">
  <div class="am-u-sm-12">
    <div class="am-scrollable-horizontal">
      <table class="am-table am-table-striped am-table-hover table-main">
        <thead>
          <tr class="am-text-nowrap">
            <th class="table-check">
              <input type="checkbox"  id="allCheck"/>
            </th>
            <th class="table-title">名称</th>            
            <th class="table-title">图片</th>
            <th class="table-title">大小(KB)</th>
            <th class="table-title">页面链接</th>
            <th class="table-title">开始时间</th>
            <th class="table-title">结束时间</th>
            <th class="table-title">备注</th>
            <th class="table-title">启用</th>
            <th class="table-set">操作</th>
          </tr>
        </thead>
        <tbody>
          <%for(list in pager.list!){%>
          <tr>
            <td>
              <input type="checkbox" name="ids" value="${list.id}"></td>
            <td>
              <%if(so.hasPermission("SPLASH_IMAGE_EDIT")) {%>
              <a href="${base}/splashImage/edit?id=${list.id}">${list.title}</a>
              <%}else{%>
              ${list.title}
              <%}%></td>
            <td class="am-text-nowrap"><a href='javascript:void(0);' onclick="previewSplashImage('${list.img_url}');" >点击查看</a></td>
            <td>${list.img_size}</td>
            <td><a href='${list.link_url}' target="_blank">${list.link_url}</a></td>
            <td class="am-text-nowrap">${list.start_date}</td>
            <td class="am-text-nowrap">${list.end_date}</td>
            <td><%if(strutil.length(list.remark)>0){%><a href="javascript:void(0);" onclick="showRemark('${list.remark}');">详情</a><%}%></td>
            <td>
              <%if (list.enabled==1){%>
              是
              <%}else{%>
              否
              <%}%></td>
            <td >
              <div class="am-btn-toolbar">
                <div class="am-btn-group am-btn-group-xs">
                  <%if(so.hasPermission("SPLASH_IMAGE_EDIT")) {%>
                  <a href="${base}/splashImage/edit?id=${list.id}">修改</a>
                  <%}%>                
                  </div>
              </div>

            </td>
          </tr>
          <%}%></tbody>
      </table>
    </div>
    <div class="am-cf">
      <!-- 分页 -->
      <%if (pager.list.~size >
      0){%>
      <div class="am-fr">
        <% include("/admin/common_pager.tpl"){}%></div>
      <%}else{%>
      <div class="am-kai">
        <h3>没有找到任何记录!</h3>
      </div>
      <%}%></div>
  </div>
</div>
</div>
<div class="am-modal am-modal-alert" tabindex="-1" id="remark-alert">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">备注</div>
    <div class="am-modal-bd" id="remark-detail">     
    </div>
    <div class="am-modal-footer">
      <span class="am-modal-btn">确定</span>
    </div>
  </div>
</div>
<script type="text/javascript">
    $(function(){
      var keywordsObj = {};
      $("#submit-btn").on("click",function(){
        if($("#title").val()){
          keywordsObj.title = $("#title").val();
        }
        var keywords = "";
        if(!$.isEmptyObject(keywordsObj)){
          keywords = JSON.stringify(keywordsObj);
        }
        console.log("keywords = "+ keywords);

        $("#keywords").val(keywords);
        $("#list-form").submit();
      });      
    });
    function previewSplashImage(imgUrl){
      console.log('imgUrl:' +imgUrl);
      console.log('window.location.host:' + window.location.host);
      var url = window.location.protocol + '//' + window.location.host + imgUrl;
      window.open(url);
    }
    function showRemark(content){
      $("#remark-detail").html(content);
      $("#remark-alert").modal();
    }

  </script>
<%}%>
<%}%>
